<template>
  <BasicDrawer @register="register" v-bind="$attrs" title="物流记录" width="30%">
    <!-- <div :class="['color-#05a390', 'font-bold', 'font-size-20px', 'mb-10px', 'ml-20px']"> 时间轴 </div> -->
    <a-timeline mode="left" >
      <a-timeline-item v-for="item in taskFlowList" :label='item.time' >
        <div class="color-#f68052">{{ item.context }}</div>
      </a-timeline-item>
    </a-timeline>
  </BasicDrawer>
</template>

<script lang="ts" setup>
  import { ref, watchEffect, computed } from 'vue';
  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';

  //流程时间轴
  const taskFlowList = ref();
  const [register, { closeDrawer }] = useDrawerInner(async (data) => {
    //有id 有指定的接口时才查询
    if (data.params && data.apiUrl && data.apiUrl instanceof Function) {
      var res = await data.apiUrl(data.params);
      taskFlowList.value = res;
      console.log('taskFlowList',taskFlowList.value);
    }
  });
</script>
